<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix='fmt' uri="http://java.sun.com/jsp/jstl/fmt" %>
<% 
response.setHeader("Pragma","No-cache"); 
response.setHeader("Cache-Control","no-cache"); 
response.setDateHeader("Expires", 0); 
%> 
<link rel="stylesheet" href="static/plugs/editor.md/css/editormd.min.css" />
<div style="padding: 10px;">
	<form id="addfilesuploadform" action="${pageContext.request.contextPath}/back/files/addfilesupload" enctype="multipart/form-data" method="post">
		<input id="addfilesuploadinput" onchange="uploadfile();" type="file" name="file" style="display: none;"/>
	</form>
	<form id="articleAddForm" class="layui-form layui-form-pane" action="${pageContext.request.contextPath}/back/article/addarticle">
		
		<table style="width:100%;">
			<tr>
				<td class="layui-form layui-form-pane" valign="top" style="with:50%;border: 0px solid #e6e6e6;padding-right: 10px;min-width: 400px;">
					<div class="layui-form-item ">
					    <label class="layui-form-label">文章标题</label>
					    <div class="layui-input-block">
					      <input type="text" name="title" lay-verify="required" autocomplete="off" maxlength="100" placeholder="请输文章标题" class="layui-input">
					    </div>
					</div>
					<div class="layui-form-item ">
					    <label class="layui-form-label">文章分类</label>
					    <div class="layui-input-block">
					    	<select name="category">
						        <option value=" ">请选择</option>
						        <c:forEach var="t" items="${categorys}" varStatus="status">
							        <option value="${t.id}">${t.name}</option>
						        </c:forEach>
						    </select>
					    </div>
					</div>
					<div class="layui-form-item layui-form-text">
					    <label class="layui-form-label">
					    	头部图片&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
					    	<a onclick="$('#addfilesuploadinput').click();" class="layui-btn layui-btn-normal layui-btn-radius layui-btn-mini"><i class="layui-icon"></i>&nbsp&nbsp上传</a>
					      	<a onclick="removetagsnew();" class="layui-btn  layui-btn-primary layui-btn-radius layui-btn-mini">选择已有图片</a>
					      	<input id="topimginput"  name="topimg" lay-verify="required"  style="display:none;"/>
					      	<script type="text/javascript">
					        //上传文件
						  	function uploadfile(){
						  		$("#addfilesuploadform").ajaxSubmit({
							        type: 'post', // 提交方式 get/post
							        success: function(data) { // data 保存提交后返回的数据，一般为 json 数据
							        	var json = eval(data);
							        	console.log(json);
							        	if(json.code=="0"){
							                layer.msg('添加成功！');
							                $("#topimgshow").html("<img style='height:100px;' src='"+json.data.src+"'/>");
							                $("#topimginput").val(json.data.src);
							        	}else{
							                layer.msg('添加失败！');
							        	}
							        }
							    });
						  	}
					      	</script>
					    </label>
					    <div id="topimgshow" class="layui-input-block" style="height:100px;border: 1px solid #e6e6e6;">
					    </div>
					</div>
					<div class="layui-form-item layui-form-text">
					    <label class="layui-form-label">摘要</label>
					    <div class="layui-input-block">
					      <textarea id="articlesummary" name="summary" maxlength="200" placeholder="请输文章摘要（可自动生成摘要）" class="layui-textarea"></textarea>
					    </div>
					</div>
				</td>
				<td class="layui-form layui-form-pane" valign="top" style="with:50%;border: 0px solid #e6e6e6;min-width: 400px;">
					<div class="layui-form-item ">
					    <label class="layui-form-label">显示状态</label>
					    <div class="layui-input-block" style="border: 1px solid #e6e6e6;">
					    	<input type="radio" name="status" value="0" title="正常" checked="">
						    <input type="radio" name="status" value="1" title="加密">
						    <!-- <input type="radio" name="status" value="2" title="隐藏"> -->
					    </div>
					</div>
					<div class="layui-form-item ">
					    <label class="layui-form-label">密码</label>
					    <div class="layui-input-block">
					      <input type="password" name="password" autocomplete="off" maxlength="50" placeholder="请输密码(加密状态有效)" class="layui-input">
					    </div>
					</div>
					<div class="layui-form-item ">
					    <label class="layui-form-label">显示类型</label>
					    <div class="layui-input-block">
					    	<select name="type">
						        <option value="1">日志</option>
						        <option value="2">图片</option>
						        <option value="0">单页面</option>
						    </select>
					    </div>
					</div>
					<div class="layui-form-item layui-form-text">
					    <label class="layui-form-label">标签</label>
					    <div class="layui-input-block" style="border: 1px solid #e6e6e6;">
					    	<div id="tagscheckbox">
						    	<c:forEach var="t" items="${tags}" varStatus="status">
							    	<input type="checkbox" name="tags" value="${t.id}" title="${t.name}">
						        </c:forEach>
					    	</div>
					        <hr>
					        <div  class="layui-form-item" style="padding-left: 10px;margin-bottom: 3px;">
						        <div class="layui-inline">
							      <div class="layui-input-inline">
							        <input id="addtag" type="text" autocomplete="off" class="layui-input">
							      </div>
							    </div>
							    <div class="layui-inline">
							    	<script type="text/javascript">
							    		function addtag(){
							    			if($("#addtag").val()!=""){
								    			$('#tagscheckbox').append('<input class="tagsnew" type="checkbox" name="tagsnew" value="'+$("#addtag").val()+'" title="'+$("#addtag").val()+'" checked="">');
								    			$('#addtag').val("");
								    			checkboxresetshow();
							    			}
							    		}
							    		function checkboxresetshow(){
								    			layui.use(['form'], function(){layui.form().render('checkbox');});
							    		}
							    		function removetagsnew(){
							    			$('.tagsnew').remove();
							    			$('.layui-form-checkbox').remove();
							    			checkboxresetshow();
							    		}
							    	</script>
							      <a onclick="addtag();" class="layui-btn layui-btn-normal layui-btn-radius">添加</a>
							      <a onclick="removetagsnew();" class="layui-btn  layui-btn-primary layui-btn-radius">清除新增标签</a>
							    </div>
					        </div>
					    </div>
					</div>
				</td>
			</tr>
		</table>
		<div class="layui-form-item layui-form-text" style="">
		    <label class="layui-form-label">内容</label>
		    <div class="layui-input-block">
		    	<div id="articlecontenteditormd">
                	<textarea name="content" id="articlecontent" style="display:none;"></textarea>
	            </div>
		    </div>
		</div>
		<div class="layui-form-item" align="center">
		    <button class="layui-btn"  lay-submit="" lay-filter="articleAddSubmit" style="width:120px;">提交</button>
		    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
		</div>
	</form>
	<script src="${pageContext.request.contextPath}/static/js/back/article/articleAddPage.js"></script>
	<script src="static/plugs/editor.md/editormd.min.js"></script>
    <script type="text/javascript">
		var articlecontenteditormd;
        $(function() {
            articlecontenteditormd = editormd({
                id      : "articlecontenteditormd",
                width   : "100%",
                height  : 640,
                emoji : true,
                saveHTMLToTextarea : true,
                imageUpload : true,
                imageFormats : ["jpg", "jpeg", "gif", "png", "bmp"],
                imageUploadURL : basePath+"back/files/editormdimagefile",
                path    : "static/plugs/editor.md/lib/"
            });
        });
    </script>
</div>
    